<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="weex-viewport" content="750">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-touch-fullscreen" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="format-detection" content="telephone=no, email=no">
  <script src="https://cdn.bootcss.com/echarts/4.1.0.rc2/echarts-en.common.js"></script>
</head>
<style>
body{
    width: 100%;
    height:240px;
    padding: 0;
    margin: 0;
    background-color: #f5f5f5;
}
.main{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
</style>
<body>
    <div class="main">
        <div id="chart" style="width: 100%;height:100%;"></div>
    </div>
</body>

<script>
    // window.onload = function(){
        var myChart = echarts.init(document.getElementById('chart')); 
        
        var option = {
            graphic: [
            {
                type: 'text',
                left: 'center',
                top: '47%',
                style: {
                text: '资产',
                textAlign: 'center',
                fill: '#8a8a8a',
                fontSize: 12
                },
            },
            {
                type: 'text',
                left: 'center',
                top: '55%',
                style: {
                text: '448,787.00',
                textAlign: 'center',
                fontSize: 14
                }
            },
            ],
            series: [
            {
                type: 'pie',
                center: ['50%', '55%'],
                radius: ['45%', '70%'],
                data: [
                { value: 51.22, name: '所有者权益：51.22%' },
                { value: 48.78, name: '负债：48.78%' }
                ],
                itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
                },
                labelLine: {
                length: 5,
                length2: 5
                },
                color: ['#8ed22f', '#00c7da']
            }
            ]
        };
        myChart.setOption(option);
</script>
</html>